<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<script type="text/javascript">
	$(function() {
		var $grid = $('#grid_role');
		var $title = '角色';
		var $baseUrl = 'sys/role';
		$grid.datagrid({
			title : $title + '列表',
			url : $baseUrl + '/list?sort=sort,asc',
			dialog : {
				url : $baseUrl,
				name : $title,
				create : {
					width : 400,
					height : 240
				},
				update : {
					width : 400,
					height : 240
				},
				permission : {
					width : 1280,
					height : 468,
					name : '设置权限',
					title : '设置角色权限',
					url : 'permission',
					href : 'sys/permission/dialog',
					buttons : [ $.dialog.buttons.save, $.dialog.buttons.close ],
					onSubmitSuccess : function(data, options) {
						$.dialog.close();
						var $grid = $('#grid_role_permission')
						$.crudgrid.gridMethod($grid, 'reload');
					}
				}
			},
			columns : [ [ $.fields.name, $.fields.description, $.fields.sort, $.fields.createTime, $.fields.lastModifyTime, $.fields.status ] ],
			onSelect : function(index, row) {
				$('#grid_role_permission').treegrid('load', {
					'joinIds' : row.id
				});
			},
			toolbar : [ $.crudgrid.buttons.create, $.crudgrid.buttons.update, $.crudgrid.buttons.remove, '-', {
				text : '权限',
				iconCls : 'icon-details',
				handler : function() {
					$.crudgrid.getGrid(this).datagrid('dialog.update', 'permission');
				}
			}, '-', $.crudgrid.buttons.refresh ]
		}).treegrid('filter.init');
	});
</script>
<script>
	$(function() {
		var $grid = $('#grid_role_permission');
		var title = '权限';
		var $baseUrl = 'sys/permission';
		$grid.treegrid({
			border : false,
			singleSelect : false,
			title : title + '列表',
			url : $baseUrl + '/treeGrid?sort=sort,asc',
			onLoadSuccess : function(data) {
				$(this).treegrid('initSelected');
			},
			onBeforeSelect : function(row) {
				if (!row.selected) {
					return false;
				}
			},
			onBeforeUnselect : function(row) {
				return false;
			},
			columns : [ [ $.fields.permission.checkbox('permissionIds', true), $.fields.treeField, $.fields.status ] ],
			toolbar : [ $.crudgrid.buttons.refresh, '-' ]
		}).treegrid('filter.init');
	});
</script>
<div class="easyui-layout" data-options="fit:true">
	<div data-options="region:'center',split:true,border:false">
		<table id="grid_role"></table>
	</div>
	<div data-options="region:'east',split:true" style="width: 390px;">
		<div class="easyui-tabs" data-options="fit:true">
			<div title="权限列表">
				<table id="grid_role_permission"></table>
			</div>
		</div>
	</div>
</div>